<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:jsp="http://java.sun.com/JSP/Page"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:p="http://primefaces.org/ui">

<h:head>
	<title>Tableau de bord : un cinéma</title>

	<link rel="stylesheet" href="../styles/style.css" />
</h:head>

<h:body>
	<h:panelGroup rendered="#{loginBean.loginSucces}">
		<ui:include src="../includes/header.xhtml" />
		<ui:include src="../includes/menu.xhtml" />

		<div id="content">
			<h2>Tableau de bord</h2>
			<h:form id="form">
				<h:panelGroup rendered="#{tableauBordUnCinemaBean.loginAcheteur}">	
					<div class="choixCinemaTab">
						<div class="carouselCinema">
				    		<p:carousel id="basicCarousel" value="#{tableauBordUnCinemaBean.cinemas}" var="cinema" rows="3" headerText="Liste des cinémas">  
								<div class="itemCarouselCine">
						            <div class="cineName"> <h:outputText value="#{cinema.nom}" /> </div>
						            <div class="cineAdresse"> <h:outputText value="#{cinema.adresse}" /> </div>
						            <div class="cineVille"> <h:outputText value="#{cinema.codePostal} #{cinema.ville}" /> </div>
							        <div class="cineBtnChoix">
										<p:commandLink id="view" title="Choisir cinéma" update=":form:cineChoisiNom, :form:cineChoisiAdresse, :form:cineChoisiCP">  
								            <h:outputText styleClass="ui-icon ui-icon-circle-check" style="margin:0 auto;" />   
								            <f:setPropertyActionListener value="#{cinema}"   
								                    target="#{tableauBordUnCinemaBean.leCinema}" />  
								        </p:commandLink>
						        	</div>
						        </div>
						    </p:carousel>  
						</div>
						<div class="CinemaChoisi">
							<div class="cineChoisiTitle"> <h:outputText value="Cinéma choisi" /> </div>
							<div class="ItemCinemaChoisi">
								<div class="cineName"> <h:outputText id="cineChoisiNom" value="#{tableauBordUnCinemaBean.leCinema.nom}" /> </div>
					            <div class="cineAdresse"> <h:outputText id="cineChoisiAdresse" value="#{tableauBordUnCinemaBean.leCinema.adresse}" /> </div>
					            <div class="cineVille"> <h:outputText id="cineChoisiCP" value="#{tableauBordUnCinemaBean.leCinema.codePostal} #{tableauBordUnCinemaBean.leCinema.ville}" /> </div>
							</div>
						</div>	
					</div>
				</h:panelGroup>
			
				<div id="tableauBordUnCinema_parametres">
					<div class="tableauBordUnCinema_parametre" id="tableauBordUnCinema_parametre_cam_courbe">
						<div class="tableauBordUnCinema_parametre_label" id="tableauBordUnCinema_parametre_cam_courbe_label">
							Type
						</div>
					
						<div class="tableauBordUnCinema_parametre_contenu" id="tableauBordUnCinema_parametre_cam_courbe_contenu">
							<p:selectOneButton value="#{tableauBordUnCinemaBean.type}">
								<f:selectItem itemLabel=" % " itemValue="piechart" />  
								<f:selectItem itemLabel="Nb" itemValue="linechart" />
							</p:selectOneButton>
						</div>
					</div>
						
					<div class="tableauBordUnCinema_parametre" id="tableauBordUnCinema_parametre_critere">
						<div class="tableauBordUnCinema_parametre_label" id="tableauBordUnCinema_parametre_critere_label">
							Critère
						</div>
					
						<div class="tableauBordUnCinema_parametre_contenu" id="tableauBordUnCinema_parametre_critere_contenu">
							<p:selectOneMenu value="#{tableauBordUnCinemaBean.critere}">
								<f:selectItem itemLabel="Genre de film" itemValue="genreFilm" />
								<f:selectItem itemLabel="Type de spectateur" itemValue="typeSpectateur" />
								<f:selectItem itemLabel="Toutes les entrées" itemValue="toutesEntrees" />
							</p:selectOneMenu>
						</div>
					</div>
						
					<div class="tableauBordUnCinema_parametre" id="tableauBordUnCinema_parametre_date_debut">
						<div class="tableauBordUnCinema_parametre_label" id="tableauBordUnCinema_parametre_date_debut_label">
							Date début
						</div>
					
						<div class="tableauBordUnCinema_parametre_contenu" id="tableauBordUnCinema_parametre_date_debut_contenu">
							<p:calendar value="#{tableauBordUnCinemaBean.dateDebut}" id="date_debut" 
										size="9" pattern="dd/MM/yyyy" required="true" label="Date Début" />
						</div>
					</div>
		
					<div class="tableauBordUnCinema_parametre" id="tableauBordUnCinema_parametre_date_fin">
						<div class="tableauBordUnCinema_parametre_label" id="tableauBordUnCinema_parametre_date_fin_label">
							Date fin
						</div>
					
						<div class="tableauBordUnCinema_parametre_contenu" id="tableauBordUnCinema_parametre_date_fin_contenu">
							<p:calendar value="#{tableauBordUnCinemaBean.dateFin}" id="date_fin" 
										size="9" pattern="dd/MM/yyyy" required="true" label="Date Fin" />
							
						</div>
					</div>
						
					<div class="tableauBordUnCinema_parametre" id="tableauBordUnCinema_parametre_valider">
	
						<p:commandButton
							value="Valider"
							icon="ui-icon-check"
							ajax="false"
							id="valider"
							actionListener="#{tableauBordUnCinemaBean.valide}" />
							
					</div>
					<div class="clear"></div>
					<div id="tableauBordUnCinema_parametre_message_erreur">
						<p:message for="date_debut" />
						<p:message for="date_fin" />
					</div>
				</div>
				<hr class="tableauBordUnCinema_hr" />
			
				<div id="tableauBordUnCinema_schema">
					
						<p:panel id="piechart_panel" rendered="#{tableauBordUnCinemaBean.type == 'piechart'}">
							<p:pieChart id="piechart" 
										value="#{tableauBordUnCinemaBean.pieModel}"
										legendPosition="e"
										fill="false"
										showDataLabels="true"  
			                			title="#{tableauBordUnCinemaBean.chartTitle}"
			                			style="width:600px;height:500px;margin: auto"
			                			sliceMargin="5"
			                			diameter="350"
			                			animate="true" /> 
						</p:panel>
						
						
						<p:panel id="linechart_panel" rendered="#{tableauBordUnCinemaBean.type == 'linechart'}">
							<p:lineChart id="linear" 
										value="#{tableauBordUnCinemaBean.linearModel}"
										legendPosition="e"  
										title="#{tableauBordUnCinemaBean.chartTitle}"
										style="height:500px"
										animate="true" />
						</p:panel>
						
				</div>
			</h:form>
		</div>


		<ui:include src="../includes/footer.xhtml" />

	</h:panelGroup>

	<h:panelGroup rendered="#{!loginBean.loginSucces}">
		<ui:include src="../includes/authError.xhtml" />
	</h:panelGroup>

</h:body>
</html>